window.onload = function() {
    let username = document.getElementById("username")
    let password = document.getElementById("password")
    console.log(username.value)

    username.addEventListener("input", (e) => {
        console.log("正在输入", e.target.value)
    })

    let btn = document.querySelector("button")
    btn.addEventListener("click", (e) => {
        e.preventDefault()

        let name = username.value
        let key = password.value

        let xhr = new XMLHttpRequest()
            //建立连接
        xhr.open("GET", "http://172.19.11.9:8080/login", true) //打开链接的通道
            //异步请求的状态监听
        xhr.onreadystatechange = () => {
            //readyState
            //0请求已经创建，但是还没有使用open
            // 调用了open，还没发送
            // 服务器返回响应头
            // 正在读取响应体
            // 请求完成，相应可用
            if (xhr.readyState === 4 && xhr.status === 200) {
                console.log("请求成功了")
                    // 4.得到响应
            }
        }
        console.log("开始发送请求")
        xhr.send()
            // 3发送请求
        console.log("发送请求后的代码")
        console.log("发送请求后的代码2")

        //     let xhr2 = new XMLHttpRequest()
        //     xhr2.open("GET", "http://172.19.11.9:8080/login" + "?username" + name + "&key" + key, true)
        //     xhr2.onreadystatechange = () => {
        //         if (xhr2.readyState === 4 && xhr2.status === 200) {
        //             console.log("GET请求成功了")
        //         }
        //     }
        //     xhr2.send()
        // })

    })
}